import React, { Component } from 'react';
import { NavLink } from 'react-router-dom';
import './base.scss';
class Com extends Component {
  constructor (props) {
    super(props);
    this.state = {}
  }

  render () {
    return (
      <div className="headerBox" style = { {
        backgroundColor: this.props.background
      } }>
        <div className="header-box-wrap">
          <div className = "nav-primary">
            <div className = "nav-logo" style = { {
              color: this.props.color
            } }>
              { this.props.info }
            </div>
            <div className = "nav-search">
              <input type="text" name="" id="" placeholder="点此搜索"/>
            </div>
          </div>
        </div>
        <div className = "nav-items">
          <ul>
            {
              this.props.list.map((item, index) => {
                return (<li key = { index }>
                  <NavLink to = { item.path }>{ item.name}</NavLink>
                </li>)
              })
            }
          </ul>
        </div>
      </div>
    )
  }
}

export default Com;
